<template>
  <div>
    <div>page页面传递过来的值是</div>
    <h1>当前求和为:{{ sum }}</h1>
    <select v-model="n">
      <option value=1>1</option>
      <option value=2>2</option>
      <option value=3>3</option>
    </select>
    <button @click="increment">+</button>
    <button @click="decrement">-</button>
    <button @click="incrementOdd">当前求和为奇数再加</button>
    <button @click="incrementWait">等一等再加</button>
    <slot :user=dataForm.a></slot> 
    <slot :user=dataForm.b></slot> 
    <div>{{countData}}</div>
  </div>
</template>

<script>

 import { mapState, mapActions,mapGetters} from 'vuex';

   export default {
        name:  '',
        
        props:['countData'],
        data(){
         return{
            cData:this.countData,
            n:2,
            dataForm:{
              a:1,
              b:2,
              c:3
            }
         }
        },
        components: {
          
        },
        computed:{
          // ...mapState({
          //  sum: state => state.page.sum,
          // })
          ...mapState('page',['sum',])
        },
        methods:{
            increment(){
            this.sum+=this.n;
          
            },
            decrement(){
                this.sum+=this.n;
            },
         incrementOdd(){
          if(this.sum%2){
            this.sum+=this.n;
          }
         },
        incrementWait(){
          setTimeout(()=>{
           this.sum+=this.n+1
          },2000)
        },

        getParams(){
         return {params:this.dataForm,n:this.n};
        }
           
        }
   }
</script>

<style scoped></style>
